<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <%- include src/pages/common/styles.html -%>

  <title>申请贷款</title>
</head>
<body>
  <%- include src/pages/common/header.html -%>

  <div class="content loan">
    <div class="main-container">
        <div class="loan__steps">
            <ol class="steps">
              <li class="steps__item active">
                <span class="steps__indicator">1</span>
                <div class="steps__inner">填写贷款申请</div>
              </li>
              <li class="steps__item active">
                <span class="steps__indicator">2</span>
                <div class="steps__inner">审批</div>
              </li>
              <li class="steps__item">
                <span class="steps__indicator">3</span>
                <div class="steps__inner">签署合同</div>
              </li>
            </ol>
        </div>

        <div class="stepanel sign">
          <span class="stepanel__arrow nobar"></span>

          <div class="sign__contract"></div>

          <div class="sign__validation">
            <div class="validation__head">
              360000
              <span class="head__desc">贷款金额</span>
            </div>

            <div class="form-group">
              <label for="tradePass" class="form__label">请输入交易密码</label>
              <div class="input-suite align-bottom">
                <input type="password"
                  name="tradePass"
                  id="tradePass"
                  class="form-control"
                  placeholder="请输入"
                >
                <a href="#" class="input-suite__addon input-suite__forget">忘记交易密码</a>
              </div>
            </div>
            <div class="form-group">
              <label for="phoneNo" class="form__label">已验证手机</label>
              <input type="text"
                name="phoneNo"
                id="phoneNo" disabled
                class="form-control form-control--valid"
                value="158****7093"
              >
            </div>
            <div class="form-group">
              <label for="code" class="form__label">请填写手机校验码</label>
              <div class="input-suite">
                <input type="text" name="code" id="code" class="form-control">
                <div class="input-suite__addon input-suite__btn">
                  <button class="btn btn-primary">获取验证码</button>
                </div>
              </div>
            </div>
            <div class="form-group">
              <label for="verifyCode" class="form__label">验证码</label>
              <div class="input-suite">
                <input type="text" name="verifyCode" id="verifyCode" class="form-control">
                <div class="input-suite__addon input-suite__code"></div>
                <a href="#" class="input-suite__addon input-suite__refresh">刷新</a>
              </div>
            </div>
            <div class="sign__btn">
              <button class="btn btn-primary" data-toggle="modal" data-target="#recordTip">签署</button>
            </div>
          </div>

        </div>
    </div>
  </div>

  <div class="modal fade messagebox" id="recordTip" tabindex="-1" role="dialog" aria-labelledby="">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <a class="messagebox__close" data-dismiss="modal" aria-label="Close"></a>
        <div class="modal-body">
          <p class="text-center">接下来将录制一段视频,请确认摄像头开启, 准备好身份证, 并跟随屏幕提示朗读提示的文字.</p>
        </div>
        <div class="modal-footer">
          <button class="btn btn-primary btn--outline" data-dismiss="modal">放弃录制</button>
          <button class="btn btn-primary">开始录制</button>
        </div>
      </div>
    </div>
  </div>

  <%- include src/pages/common/footer.html -%>
  <%- include src/pages/common/scripts.html -%>

</body>
</html>